<script setup lang="ts">
import qrcode from '@/static/images/offical_account_qrcode.jpg'
</script>

<template>
  <image src="@/static/images/offical_account_bg.png" class="absolute left-0 top-0 h-screen w-screen" />
  <view class="relative z-10 flex flex-col items-center">
    <Spacer height="160" />
    <view class="flex items-center justify-center">
      <image src="@/static/images/scan.png" class="h-34rpx w-34rpx" />
      <Spacer width="20" />
      <view class="text-40rpx text-white font-medium leading-56rpx">
        长按识别下方二维码
      </view>
      <Spacer width="20" />
      <image src="@/static/images/scan.png" class="h-34rpx w-34rpx" />
    </view>
    <Spacer height="56" />
    <image src="@/static/images/gzgzh.png" class="h-94rpx w-612rpx" />
    <Spacer height="80" />
    <view class="h-400rpx w-400rpx flex items-center justify-center border-2px border-#000000 rounded-20rpx border-dashed bg-white">
      <uv-image
        width="398rpx"
        height="398rpx"
        radius="20rpx"
        :src="qrcode"
      >
        <template #loading>
          <uv-loading-icon color="#666666" />
        </template>
      </uv-image>
    </view>
    <Spacer height="80" />
    <image src="@/static/images/tr_top_black.png" class="h-10rpx w-24rpx" />
    <Spacer height="12" />
    <view class="text-24rpx text-#333333 font-medium leading-32rpx">
      关注我们
    </view>
    <Spacer height="12" />
    <view class="border-b border-b-#333333 border-b-solid py-1 text-28rpx text-#333333 font-medium leading-40rpx">
      获取最新就诊通知
    </view>
  </view>
</template>

<route lang="yaml">
name: 'officalAccount'
style:
  disableScroll: true
</route>
